<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<base href="<%=basePath%>">
		
		<meta charset="utf-8" />
		<title></title>
		
		<meta name="description" content="overview & stats" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<link href="/resources/css/bootstrap.min.css" rel="stylesheet" />
		<link href="/resources/css/bootstrap-responsive.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="/resources/css/font-awesome.min.css" />
		<!--[if IE 7]><link rel="stylesheet" href="/resources/css/font-awesome-ie7.min.css" /><![endif]-->
		<!--[if lt IE 9]><link rel="stylesheet" href="/resources/css/ace-ie.min.css" /><![endif]-->
		<!-- 下拉框 -->
		<link rel="stylesheet" href="/resources/css/chosen.css" />
		
		<link rel="stylesheet" href="/resources/css/ace.min.css" />
		<link rel="stylesheet" href="/resources/css/ace-responsive.min.css" />
		<link rel="stylesheet" href="/resources/css/ace-skins.min.css" />
			<script  type="text/javascript" src="/resources/My97DatePicker/WdatePicker.js"></script>
		<link rel="stylesheet" href="/resources/css/datepicker.css" /><!-- 日期框 -->
		<script type="text/javascript" src="/resources/js/jquery-1.7.2.js"></script>
		<script type="text/javascript" src="/resources/js/jquery.tips.js"></script>
		 <link href="/resources/css/cropper.min.css" rel="stylesheet">
        <link href="/resources/css/docs.css" rel="stylesheet">
<script type="text/javascript">
	
	
	
	//保存
	function save(){
			if($("#stattime").val()==""){
			$("#stattime").tips({
				side:3,
	            msg:'请输入开始时间',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#stattime").focus();
			return false;
		}
		if($("#endtime").val()==""){
			$("#endtime").tips({
				side:3,
	            msg:'请输入结束时间',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#endtime").focus();
			return false;
		}
		if($("#xueyuan").val()==""){
			$("#xueyuan").tips({
				side:3,
	            msg:'请输入学员数',
	            bg:'#AE81FF',
	            time:2
	        });
			$("#xueyuan").focus();
			return false;
		}
		$("#Form").submit();
		$("#zhongxin").hide();
		$("#zhongxin2").show();
	}
	
</script>
	</head>
<body>
	<form action="/qjqwmain/timer/${msg }" name="Form" id="Form" method="post">
		<input type="hidden" name="time_id" id="time_id" value="${timer.time_id}"/>
		<div id="zhongxin">
		<table  class="table table-striped table-bordered table-hover">
		<tr>
		<td>课时名称：</td>
		<td>
		<input type="text" name="timename" id="timename" value="${timer.timename}" maxlength="32" placeholder="这里输入课时名称" title="课时名称"/>
		
		</td>
		</tr>
		
			<tr>
				<td>开始时间:</td><td><input type="text" name="stattime" id="stattime" value="${timer.stattime}" onfocus="WdatePicker({skin:'whyGreen',dateFmt:'H:mm'})" placeholder="这里输入开始时间" title="开始时间"/></td>
			</tr>
			<tr>
				<td>结束时间:</td><td><input type="text" name="endtime" id="endtime" value="${timer.endtime}"  onfocus="WdatePicker({minDate:$('#stattime').val(),dateFmt:'H:mm'})" placeholder="这里输入结束时间" title="结束时间"/></td>
			</tr>
			<tr>
				<td>日期:</td><td><input type="text" name="timstr" id="timstr" value="${timer.timstr}"  onfocus="WdatePicker({minDate:'%y-%M-%d'})" placeholder="这里输入日期" title="日期"/></td>
			</tr>
			<tr>
				<td>时段图片:</td><td>
					<input type="hidden"  name="timeimg" id="img_url" value="${timer.timeimg}">
				<img src="${timer.timeimg}?imageMogr2/thumbnail/50x50" onerror="javascript:this.src='/resources/images/noPic.png';" id="ii" width="100" height="100" onclick="show();">
						<div class="main_content" id="content" style="display: none;">

          <div class="img-container"><img src="" style="display:none"></div>
          <div class="img-preview img-preview-sm"></div>
          <div class="btn-group">
            <div class="btn-primary" data-method="zoom" data-option="0.1"  title="放大">
				<label><img src="/resources/img/big.png" width="40" height="25"/></label>
            </div>
            <div class="btn-primary" data-method="zoom" data-option="-0.1"  title="缩小">
				 <label><img src="/resources/img/small.png" width="40" height="25"/></label>
            </div>
            <div class="btn-primary" data-method="rotate" data-option="-90"  title="左转90度">
				 <label><img src="/resources/img/left.png" width="40" height="25"/></label>
            </div>
            <div class="btn-primary" data-method="rotate" data-option="90"  title="右转90度">
				<label><img src="/resources/img/right.png" width="40" height="25"/></label>
            </div>
         
           
          </div>
          <div class="foot_btn"> <input type="file" style="width: 100px;" id="inputImage"   accept="image/*" placeholder="这里输入文章封面图片" title="文章封面图片">  <button  id="getDataURL2" data-toggle="tooltip" type="button" title="$().cropper('getDataURL', 'image/jpeg')"  >确定</button></div>

         
  </div>
  <input type="hidden" id="imgStr"/><!-- 这里是上传到服务器的截取后的图片的base64码,因为此参数在docs.js中指定了，所以不要该参数名，如需更改务必保持页面此input的id和docs.js中的一致 -->
				
				
				</td>
			</tr>
			<tr>
				<td>学员数:</td><td><input type="number" name="xueyuan" id="xueyuan" value="${timer.xueyuan}" maxlength="32" placeholder="这里输入学员数" title="学员数"/></td>
			</tr>
			<tr>
				<td>已预约人数:</td><td><input type="number" name="xueyuan_laile" id="xueyuan_laile" value="${timer.xueyuan_laile}" maxlength="32" placeholder="这里输入已预约人数" title="已预约人数"/></td>
			</tr>
			<tr>
				<td style="text-align: center;">
					<a class="btn btn-mini btn-primary" onclick="save();">保存</a>
					<a class="btn btn-mini btn-danger" onclick="top.Dialog.close();">取消</a>
				</td>
			</tr>
		</table>
		</div>
		
		<div id="zhongxin2" class="center" style="display:none"><br/><br/><br/><br/><br/><img src="/resources/images/jiazai.gif" /><br/><h4 class="lighter block green">提交中...</h4></div>
		
	</form>
	
	
		<!-- 引入 -->
		<script type="text/javascript">window.jQuery || document.write("<script src='/resources/js/jquery-1.9.1.min.js'>\x3C/script>");</script>
		<script src="/resources/js/bootstrap.min.js"></script>
		<script src="/resources/js/ace-elements.min.js"></script>
		<script src="/resources/js/ace.min.js"></script>
		<script type="text/javascript" src="/resources/js/chosen.jquery.min.js"></script><!-- 下拉框 -->
		<script type="text/javascript" src="/resources/js/bootstrap-datepicker.min.js"></script><!-- 日期框 -->
		<script type="text/javascript">
		$(window.parent.hangge());
		$(function() {
			
			//单选框
			$(".chzn-select").chosen(); 
			$(".chzn-select-deselect").chosen({allow_single_deselect:true}); 
			
			//日期框
			$('.date-picker').datepicker();
			
		});
		
		</script>
		
				  <script src="/resources/js/cropper.min.js"></script>
  <script src="/resources/js/docs.js"></script>
  <script>
	function show(){
		$("#content").show();
	}
      function test(){
		  var imgStr = $("#imgStr").val();
		  if(imgStr!="" || imgStr!=undefined){
		     console.log(imgStr);
		 	$.ajax({
				type: "POST",
				url: '/picture/savePic',
		    	data: {'imgStr':imgStr},
				dataType:'json',
				//beforeSend: validateData,
				cache: false,
				success: function(data){
					$("#ii").attr("src",data.imgUrl);
					$("#img_url").val(data.imgUrl);
					$("#content").hide();
				}
			});
		     
			
	      }

	  }
  
  </script>
		
</body>
</html>